<template>
    <div>
        <el-form :model="model" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
            <el-form-item label="库区编号" prop="AreaNumber">
                <el-input v-model="model.AreaNumber"></el-input>
            </el-form-item>
            <el-form-item label="库区名称" prop="AreaName">
                <el-input v-model="model.AreaName"></el-input>
            </el-form-item>
            <el-form-item label="所属仓库" prop="WarehouseName">
                <el-select v-model="model.WarehouseName" placeholder="请选择所属仓库">
                    <el-option v-for="item in WarehouseList" :key="item.Id" :label="item.WarehouseName"
                    :value="item.WarehouseName"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="位置" prop="Location">
                <el-input v-model="model.Location"></el-input>
            </el-form-item>
            <el-form-item label="面积" prop="Area">
                <el-input v-model="model.Area"></el-input>
            </el-form-item>
            <el-form-item label="负责人" prop="Charge">
                <el-input v-model="model.Charge"></el-input>
            </el-form-item>
            <el-form-item label="备注" prop="Remark">
                <el-input v-model="model.Remark"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="Primary" @click="submitForm">{{ isUpdate?'立即保存':'立即创建' }}</el-button>
                <el-button @click="resetForm">重置</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>


export default {
    props:{
        model:{
            require:true,
            type:Object
        },
        isUpdate:{
            require:true,
            type: Boolean
        }
    },
    data(){
        return{
            WmWarehouseAreaList:[],
            WarehouseList:[],
            rules:{
                AreaNumber: { required: true, message: "请输入库区编码", trigger: 'blur' },
                AreaName: { required: true, message: "请输入库区名称", trigger: 'blur' },
                AreaName: { required: true, message: "请选择所属仓库", trigger: 'blur' },
                Location: { required: true, message: "请输入位置", trigger: 'blur' },
                Area: { required: true, message: "请输入面积", trigger: 'blur' },
                Charge: { required: true, message: "请输入负责人", trigger: 'blur' },
            }
        }
    },
    created() {
        this.getWmWarehouseAreaAll();
        this.getWarehouseAll();
    },
    methods:{
        submitForm(){
            this.$refs['ruleForm'].validate((valid) =>{
                if(valid){
                    if(this.isUpdate){
                        this.put();
                    }
                    else{
                        this.add();
                    }
                }
                else{
                    this.showNotify('请请输入必填项');
                    return false;
                }
            })
        },
        resetForm() {
        this.$refs['ruleForm'].resetFields();
        },
        add(){
            this.$http.postForm('/api/WmWarehouseArea',{model:this.model},{loading:this.$loading()})
            .then(res=>{
                this.$emit('callback');
            })
        },
        put(){
            this.$http.putForm('./api/WmWarehouseArea',{model:this.model},{loading:this.$loading()})
            .then(res=>{
                this.$emit('callback');
            })
        },
        getWmWarehouseAreaAll(){
            this.$http.get('/api/WmWarehouseArea/GetAll')
            .then(res=>{
            this.UnitMeasureList=res.Data ;
            })
       },
       getWarehouseAll(){
            this.$http.get('/api/Warehouse/GetAll')
            .then(res=>{
            this.WarehouseList=res.Data ;
            })
       }
    }


}
</script>
